<template>
    <rx-dialog @handOk="handleSubmit" @cancel="cancel">
        <!-- 自定义SQL列表开始 -->
        <rx-layout>
            <div slot="center">
                <rx-fit>
                    <div slot="toolheader" border="false">
                        <div class="table-page-search-wrapper">
                            <a-form layout="inline">
                                <a-row :gutter="16">
                                    <a-col :span="8">
                                        <a-form-item :label="i18n('form.name','名称')">
                                            <a-input :placeholder="i18n('form.name','名称','input')"
                                                     v-model="queryParam.Q_NAME__S_LK"/>
                                        </a-form-item>
                                    </a-col>

                                    <a-col :span="8">
                                        <a-form-item :label="i18n('form.markKey','标识键')">
                                            <a-input :placeholder="i18n('form.markKey','标识键','input')"
                                                     v-model="queryParam.Q_KEY__S_LK"/>
                                        </a-form-item>
                                    </a-col>

                                    <a-col :span="8">
                      <span class="table-page-search-submitButtons">
                        <a-button @click="searchCustomQuery" icon="search" type="primary">{{$ti18('rxList.searchBtn','查询')}}</a-button>
                      </span>
                                    </a-col>
                                </a-row>
                            </a-form>
                        </div>
                    </div>
                    <rx-grid
                        ref="table"
                        :columns="columns"
                        :dataSource="customQueryData"
                        :defaultPageSize="20"
                        :pageSizeOptions="['20','30','40']"
                        :allowRowSelect="true"
                        data-field="result.data"
                        :id-field="rowKey"
                        :multiSelect="!single"
                        :bordered="true"
                        @selectChange="onSelectChange"
                        @rowClick="customRowFn"
                    >
                        <span slot="isShare" slot-scope="{ text, record }">
                        {{record.createBy != "SHARE" ? $ti18('rxList.no', '否') : $ti18('rxList.yes', '是')}}
                        </span>
                      <span slot="shareAppName" slot-scope="{text,record}">
                          {{record.createBy == "SHARE"?$i18(record.updateBy,'应用名称'):curApp.appName}}
                        </span>
                    </rx-grid>

                </rx-fit>
            </div>
        </rx-layout>
        <!-- 自定义SQL列表结束 -->
    </rx-dialog>
</template>

<script>
    import {RxDialog, RxFit, RxLayout, RxGrid, Util, App} from "@lowcode/jpaas-common-lib"
    import FormBoListApi from "@/api/form/core/formBoList";


    export default {
        name: "FormBoListTreeDialog",
        mixins: [App],
        components: {
            RxDialog,
            RxFit,
            RxLayout,
            RxGrid
        },
        props: {
            layerid: {
                type: String,
                default: ""
            },
            destroy: {
                type: Function
            },
            isDialog: {
                type: String,
                default: "NO"
            },
            isTreeDlg: {
                type: String,
                default: "NO"
            },
            single: {
                type: Boolean,
                default: true
            }
        },
        data() {
            return {
                key: "",
                rowKey: 'key',
                customQueryData: [],

                // 表头
                columns: [
                    {
                        title: '#',
                        type: 'indexColumn',
                        dataIndex: 'serial',
                        width: 60,
                        scopedSlots: {customRender: 'serial'}
                    },
                    {title: this.i18n('form.name', '名称'), dataIndex: 'name'},
                    {title: this.i18n('form.markKey', '标识键'), dataIndex: 'key'},
                    {title: this.$ti18('rxForm.createTime', '创建时间'), dataIndex: 'createTime'},
                    {
                        title: this.$ti18('rxList.share', '共享'),
                        dataIndex: 'isShare',
                        width: 80,
                        scopedSlots: { customRender: 'isShare' }
                    },
                  {
                    title: this.$ti18('rxList.shareAppName', '所属应用'),
                    dataIndex: 'shareAppName',
                    width: 80,
                    scopedSlots: { customRender: 'shareAppName' }
                  }
                ],
                selectedRowKeys: [],
                selectedRows: [],
                queryParam: {},
                appId: "",
            }
        },
        created() {
            let appId = this.curApp.appId;
            if (appId) {
                this.queryParam.Q_APP_ID__S_EQ = appId;
                this.appId = appId;
                //用来判断是否显示共享数据。
                this.queryParam.SHARE = true;
            }
            this.searchCustomQuery();
        },
        mounted() {
            if (!this.appId) {
                //删除共享数据列
                this.$refs.table.initColumns(this.columns.splice(4, 1));
            }
        },
        methods: {
            i18n(name, text, key) {
                return this.$ti18(name, text, "formBoListDialog", key);
            },
            handleSubmit() {
                if (this.selectedRows.length == 0) {
                    this.$message.error(this.i18n('appSelectTips', '请选择至少一个'));
                    return;
                }
                var ids=this.selectedRows.map(item=>{
                    return item.id;
                }).join(',');
                var self=this;
                FormBoListApi.getByIds(ids).then(res=>{
                    Util.closeWindow(self, "ok",res.data);
                })
            },
            cancel() {
                Util.closeWindow(this, "cancel")
            },
            getCustomQuery() {
                return this.selectedRows;
            },
            searchCustomQuery() {
                var parameter = {};
                var params = this.queryParam;
                params.Q_IS_DIALOG__S_EQ = this.isDialog;
                params.Q_IS_TREE_DLG__S_EQ = this.isTreeDlg;
                parameter.params = params;
                FormBoListApi.query(parameter).then(result => {
                    this.customQueryData = result.data;
                })
            },
            onSelectChange(selectedRowKeys, selectedRows) {
                this.selectedRowKeys = selectedRowKeys
                this.selectedRows = selectedRows
            },
            customRowFn(record, index) {

                let key = record[this.rowKey]
                this.selectedRowKeys = [key]
                this.selectedRows = [record]
            }
        }
    }
</script>

<style>
    .table-page-search-wrapper .table-page-search-submitButtons {
        display: inline-block;
        line-height: 40px;
    }
</style>